<!DOCTYPE HTML >
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>人事管理系统 ——文档管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="pragma" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache"/>
    <meta http-equiv="expires" content="0"/>
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"/>
    <meta http-equiv="description" content="This is my page"/>
    <link th:href="@{/css/css.css}" type="text/css" rel="stylesheet"/>
    <link th:href="@{/css/pager.css}" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" th:src="@{/js/jquery-1.11.0.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery-migrate-1.2.1.js}"></script>
    <link th:href="@{/js/ligerUI/skins/Aqua/css/ligerui-dialog.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/js/ligerUI/js/core/base.js}" type="text/javascript"></script>
    <script th:src="@{/js/ligerUI/js/plugins/ligerDialog.js}" type="text/javascript"></script>
    <script th:src="@{/js/ligerUI/js/plugins/ligerDrag.js}" type="text/javascript"></script>
    <script th:src="@{/js/ligerUI/js/plugins/ligerResizable.js}" type="text/javascript"></script>

    <script type="text/javascript">
        function selectall() {//全选
            var a = empform.checkList.length;
            if (a != undefined){
                for (i = 0; i < a; i++)
                    empform.checkList[i].checked = true;
            }
        }

        function unselectall() {//取消全选
            var a = empform.checkList.length;
            if (a != undefined){
                for (i = 0; i < a; i++)
                    empform.checkList[i].checked = false;
            }
        }


        $(function() {

            var boxs = $("input[type='checkbox'][id^='box_']");
            /** 给全选按钮绑定点击事件  */
            $("#checkAll").click(function() {
                // this是checkAll  this.checked是true
                // 所有数据行的选中状态与全选的状态一致
                boxs.attr("checked", this.checked);
            })

            /** 给每个数据行绑定点击事件：判断如果数据行都选中全选也应该选中，反之  */
            boxs.click(function(event) {
                /** 去掉复选按钮的事件传播：点击复选会触发行点击：因为复选在行中 */
                event.stopPropagation();

                /** 判断当前选中的数据行有多少个  */
                var checkedBoxs = boxs.filter(":checked");
                /** 判断选中的总行数是否等于总行数：以便控制全选按钮的状态   */
                $("#checkAll").attr("checked", checkedBoxs.length == boxs.length);
            })

            /** 给数据行绑定鼠标覆盖以及鼠标移开事件  */
            $("tr[id^='data_']").hover(function() {
                $(this).css("backgroundColor", "#eeccff");
            }, function() {
                $(this).css("backgroundColor", "#ffffff");
            }).click(function() {
                /** 控制该行是否需要被选中 */
                /** 获取此行的复选框id */
                var checkboxId = this.id.replace("data_", "box_");

                /** 触发本行的复选点击 */
                $("#" + checkboxId).trigger("click");
            })

            /** 删除员工绑定点击事件 */
            $("#delete")
                .click(
                    function() {
                        /** 获取到用户选中的复选框  */
                        var checkedBoxs = boxs.filter(":checked");
                        if (checkedBoxs.length < 1) {
                            $.ligerDialog.error("请选择一个需要删除的文档！");
                        } else {
                            /** 得到用户选中的所有的需要删除的ids */
                            var ids = checkedBoxs.map(function() {
                                return this.value;
                            })

                            $.ligerDialog
                                .confirm(
                                    "确认要删除吗?",
                                    "删除文档",
                                    function(r) {
                                        if (r) {
                                            // alert("删除："+ids.get());
                                            // 发送请求
                                            window.location = "/document/removeDocument/"
                                                + ids.get();
                                        }
                                    });
                        }
                    })

            /** 下载文档功能 */
            $("a[id^='down_']")
                .click(
                    function() {
                        /** 得到需要下载的文档的id */
                        var id = this.id.replace("down_", "");
                        /** 下载该文档 */
                        window.location = "document/downLoad/"
                            + id;
                    })
            /** 删除员工绑定点击事件 */
            $("#delete").click(function(){
                var ids;
                $("input[type=checkbox]:checked").each(function(){
                    if(ids){
                        ids+="," +$(this).attr('value');

                    }else{
                        ids=$(this).attr('value');

                    }
                });
                if(!ids){
                    $.ligerDialog.error("请选择一个需要删除的用户！");
                }else{


                    $.ligerDialog.confirm("确认要删除吗?","删除用户",function(r){
                        if(r){

                            window.location = "/document/delete/"+ids;
                        }
                    });
                }
            });
            //跳页:
            $("#btnOk").click(function(){
                var skillNumber= $("#skillTo").val()-0;

                if(isNaN(skillNumber)){

                    alert("必须是数字!");
                    return ;
                }

                if(skillNumber<1||skillNumber>([[${pageBean.totalPage}]]-0)){
                    alert("输入不合法,请重新输入(有效值:1-"+[[${pageBean.totalPage}]]+")");
                    return ;
                };

                $("#empform").attr("action","/document/searchDocument/"+skillNumber);
                $("#empform").submit();

            })

        })

        function down(id) {
            $("a[id='down_" + id + "']").trigger("click");
        }
        function pre(){

            preCount=[[${pageBean.currentPage-1}]]-0;
            if(preCount<1){
                alert("当前已是第一页");
                return;

            }
            $("#empform").attr("action","/document/searchDocument/"+preCount);
            $("#empform").submit();


        }
        function next(){

            nextCount=[[${pageBean.currentPage+1}]]-0;
            if(nextCount>([[${pageBean.totalPage}]]-0)){
                alert("当前已是最后一页");
                return;

            }
            $("#empform").attr("action","/document/searchDocument/"+nextCount);
            $("#empform").submit();


        }
        function downloadMethod(id) {
            $.ajax({
                type : "post",
                url : "/document/findDownlaodFile/"+ id,
                dataType : "json",
                success : function(data) {
                    if(data.flag){
                        /* 下载文件 */
                        window.location.href="/document/download/"+ id
                        /*提示  */
                        $.ajax({
                            type : "post",
                            url : "/document/tips",
                            dataType : "json",
                            success : function(data) {
                                alert(data.message)
                            }

                        });
                    }else{
                        alert(data.message)

                    }
                }

            });
        }
    </script>
</head>
<body>
<!-- 导航 -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td height="10"></td>
    </tr>
    <tr>
        <td width="15" height="32"><img th:src="@{/images/main_locleft.gif}" width="15" height="32"></td>
        <td class="main_locbg font2"><img th:src="@{/images/pointer.gif}">&nbsp;&nbsp;&nbsp;当前位置：文档管理 &gt; 文档查询</td>
        <td width="15" height="32"><img th:src="@{/images/main_locright.gif}" width="15" height="32"></td>
    </tr>
</table>

<form name="empform" method="post" id="empform" th:action="@{/document/searchDocument/1}">
    <table width="100%" height="90%" border="0" cellpadding="5" cellspacing="0" class="main_tabbor" id="vue01">
        <!-- 查询区  -->
        <tr valign="top">
            <td height="30">
                <table width="100%" border="0" cellpadding="0" cellspacing="10"
                       class="main_tab">
                    <tr>
                        <td class="fftd">
                            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td class="font3">标题：<input type="text" name="title"
                                                                th:value="${document.title }" /> <input
                                            type="submit" value="搜索" /> <input type="button" id="delete"
                                                                               value="删除">
                                    </td>
                                </tr>
                            </table>

                        </td>
                    </tr>
                </table>
            </td>
        </tr>

        <!-- 数据展示区 -->
        <tr valign="top">
            <td height="20">
                <table width="100%" border="1" cellpadding="5" cellspacing="0"
                       style="border: #c2c6cc 1px solid; border-collapse: collapse;">
                    <tr class="main_trbg_tit" align="center">
                        <td width="70px"><input type="button" value="全选" onclick="selectall()" /><input type="button" value="取消" onclick="unselectall()" /></td>
                        <td>标题</td>
                        <td>创建时间</td>
                        <td>创建人</td>
                        <td>描述</td>
                        <td>操作</td>
                        <td>下载</td>
                    </tr>

                        <tr  class="main_trbg" align="center"   th:each="document:${pageBean.items}" >
                            <td><input type="checkbox" id="box_${stat.index}" th:value="${document.id}" name="checkList"></td>
                            <td th:text="${document.title }">${document.title }</td>
                            <td th:text="${document.create_date }"> </td>
                            <td th:text="${document.user.loginName }">${document.user.loginName }</td>
                            <td th:text="${document.remark }">${document.remark }</td>
                            <td align="center" width="40px;"><a th:href="@{/document/toUpdateDocument/}+${document.id}">
                                <img title="修改"
                                     th:src="@{/images/update.gif}" />
                            </a></td>
                            <td align="center" width="40px;"><a href="#" th:onclick="|downloadMethod('${document.id}')|">
                                <img width="20" height="20" title="下载"
                                     th:src="@{/images/downLoad.png}" />
                            </a>
                            </td>
                        </tr>



                </table>
            </td>
        </tr>

        <!-- 分页标签 -->
        <tr valign="top" >

            <td align="center" class="font3" >
                <div id="isShowsss" th:if="${(pageBean.totalCount-0)!=0}">
                    <a href="javaScript:pre()"> 上一页</a>
                    <span>[[${pageBean.currentPage}]]</span>
                    <a href="javaScript:next('[[${pageBean.currentPage+1}]]')">下一页</a> &nbsp;
                    跳转到: <input type="text" size="5" id="skillTo">  <button id="btnOk">确定</button>  &nbsp;
                    总记录数: [[${pageBean.totalCount}]] &nbsp;
                    总页数: [[${pageBean.totalPage}]] &nbsp;
                    当前显示: [[${(pageBean.currentPage-1)*pageBean.pageSize+1}]]
                    - [[${pageBean.currentPage == pageBean.totalPage ? pageBean.totalCount : pageBean.currentPage*pageBean.pageSize
                    }]]


                </div>


            </td>

        </tr>

    </table>
</form>
<div style="height: 10px;"></div>

</body>
</html>